<%--
  Created by IntelliJ IDEA.
  User: 28101
  Date: 2021/9/22
  Time: 17:01
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <script src="/js/jquery-3.3.1.min.js"></script>
    <title>商品管理页面</title>

    <style>
        .page1{
            font-size: 30px;
            margin-right: 50px;
            width: 150px;
        }

        .page2{
            font-size: 30px;
            margin-right: 50px;
            width: 150px;
        }
        .page3{
            font-size: 30px;
            width: 150px;
        }

    </style>
</head>
<body>

    <div class="pagediv">

        <div style="height: 30px;">

            <table style="position:relative; left:10px; top:15px">

                <tr>
                    <td align="center" id="pagebtn1" class="page1">手机</td>
                    <td align="center" id="pagebtn2" class="page2">家电</td>
                    <td align="center" id="pagebtn3" class="page3">智能</td>
                </tr>

            </table>

        </div>

        <div id="page1" class="indexdiv"></div>
        <div id="page2" class="indexdiv" hidden="hidden"></div>
        <div id="page3" class="indexdiv" hidden="hidden"></div>
    </div>

    <script>


        $("#page1").load("/CommodityManagerServlet?method=getCommodityByPage&type=1");
        $("#page2").load("/CommodityManagerServlet?method=getCommodityByPage&type=2");
        $("#page3").load("/CommodityManagerServlet?method=getCommodityByPage&type=3");

        $(".page1").click(function () {

            $(".indexdiv").hide();
            var btnid = $(this).attr("class");
            $("#" + btnid).toggle();
        })

        $(".page3").click(function () {

            $(".indexdiv").hide();
            var btnid = $(this).attr("class");
            $("#" + btnid).toggle();
        })

        $(".page2").click(function () {

            $(".indexdiv").hide();
            var btnid = $(this).attr("class");
            $("#" + btnid).toggle();
        })

    </script>

</body>
</html>
